<template>
    <div class="card-main">
        <div v-for="(card,index) in tabList" :style='{"height":card.h,"width":card.w,"marginLeft":card.marginLeft}'  class='card'>
            <div class='card_title'>{{card.title}}</div>
            <see  :list="card.list"  :formData="data" :key="index" ></see>
        </div>
        
        
    </div>
</template>
<script>
//import CommonList  from '../list/commonList.vue'
//import MyForm  from '../edit/Form.vue'
//import tableEdit  from '../edit/tableEdit.vue'
//import tableEditButton  from '../edit/tableEditButton.vue'
//import tableEdit2  from '../edit/tableEdit2.vue'
//import tableEdit3  from '../edit/tableEdit3.vue'
//import TableForm  from '../edit/TableForm.vue'
//import FuneralItemTable  from '../byg/FuneralItemTable.vue'
//import FuneralItemTableType  from '../byg/FuneralItemTableType.vue'
//import FuneralItemSelect  from '../byg/FuneralItemSelect.vue'
//import WarehouseItemSelect  from '../byg/WarehouseItemSelect.vue'
//import BatchFuneralItemTable  from '../gm/BatchFuneralItemTable.vue'
//import OrderFood  from '../byg/OrderFood.vue'
//import CommonPrint  from '../../views/common/print/CommonPrint.vue'
//import CemeteryTomb  from '../../views/gm/CemeteryTomb.vue'
//import editor from './editor.vue'
//import editorView from './editorView.vue'


//import { defineAsyncComponent } from 'vue' // 需要引入defineAsyncComponent
//const MyForm = defineAsyncComponent(() => import('../edit/Form.vue'))
export default {
    props:["cards","appid","data","selectData","params","showForm","sId","isFlex","oldData","noflex"],
    components: {
       see: resolve => {require(['../edit/see.vue'], resolve)},
       tableEdit: resolve => {require(['../edit/tableEdit.vue'], resolve)},
       tableEdit2: resolve => {require(['../edit/tableEdit2.vue'], resolve)},
       tableEditButton: resolve => {require(['../edit/tableEditButton.vue'], resolve)},
       TableForm: resolve => {require(['../edit/TableForm.vue'], resolve)},
       FuneralItemTableList: resolve => {require(['../byg/FuneralItemTableList.vue'], resolve)},
       FuneralItemTable: resolve => {require(['../byg/FuneralItemTable.vue'], resolve)},
       FuneralItemSimpleTable: resolve => {require(['../byg/FuneralItemSimpleTable.vue'], resolve)},
       FuneralItemTableType: resolve => {require(['../byg/FuneralItemTableType.vue'], resolve)},
       FuneralItemSelect: resolve => {require(['../byg/FuneralItemSelect.vue'], resolve)},
       WarehouseItemSelect: resolve => {require(['../byg/WarehouseItemSelect.vue'], resolve)},
       BatchFuneralItemTable: resolve => {require(['../gm/BatchFuneralItemTable.vue'], resolve)},
       OrderFood: resolve => {require(['../byg/OrderFood.vue'], resolve)},
       FuneralTitle: resolve => {require(['../byg/FuneralTitle.vue'], resolve)},
       CommonPrint: resolve => {require(['../../views/common/print/CommonPrint.vue'], resolve)},
       CemeteryTomb: resolve => {require(['../../views/gm/CemeteryTomb.vue'], resolve)},
       editor: resolve => {require(['./editor.vue'], resolve)},
       editorView: resolve => {require(['./editorView.vue'], resolve)},
       capture: resolve => {require(['./Capture.vue'], resolve)},
       CommonList: resolve => {require(['../list/commonList.vue'], resolve)},
       //MyForm,
       //tableEdit,
       //tableEditButton,
       //tableEdit2,
       //tableEdit3,
      // CemeteryTomb,
       //FuneralItemTable,
       //OrderFood,
       //TableForm,
      // CommonList,
      // CommonPrint,
       //BatchFuneralItemTable,
       //FuneralItemTableType,
       //FuneralItemSelect,
      // WarehouseItemSelect,
       //editor,
      // editorView
    },
    data(){
        return{
            size: '',
            widths:"100%",
            type:"",
            tabList:[],
            formmain:"formmain",
            styles:{
                
            }
        }
    },
    created(){
        
        
        if(this.isFlex=="Y")
           this.widths=this.cards.w;
        this.type=this.cards.type;
        //this.tabList.push(this.cards);
        this.tabList=[];
        let cards=JSON.parse(JSON.stringify(this.cards));
        cards.w="100%"
        let list=[];

        let isSet=false;
        if(this.cards.list.length>0){
            for(let i=0;i<this.cards.list.length;i++){
                if(this.cards.list[i].type=="card"){
                    try{
                        if(this.cards.list[i].exkey.flex){//classname
                            this.formmain=this.cards.list[i].exkey.flex;
                            isSet=true;
                        }
                    }catch(e){}
                    cards.list=JSON.parse(JSON.stringify(list));
                    let prew=this.cards.list[i].exkey.prew;  //上一个宽度
                    let w=this.cards.list[i].exkey.w;  
                    let title=this.cards.list[i].exkey.title;
                    cards.w=prew;
                    this.tabList.push(cards);
 
                    cards=JSON.parse(JSON.stringify(this.cards));
                    cards.title=title;
                    cards.w=w;
                    cards.marginLeft="3px"
                    list=[];

                }else{
                    list.push(this.cards.list[i]);
                }
            }
            if(list.length>0){
                cards.list=JSON.parse(JSON.stringify(list));
                this.tabList.push(cards);
            }
        }else{
            this.cards.w="100%"
            this.tabList.push(this.cards)
        }
        if(this.noflex=="noflex"&&!isSet){
            this.formmain="formmainnoflex"
        }
        try{
            if(cards.exkey.flexs){
                this.formmain=cards.exkey.flexs;
            }
        }catch(e){}
        
        this.styles["height"]=cards.h;
        this.styles["width"]=this.widths;
        try{
            if(cards.exkey.styles){
                let styles=cards.exkey.styles;
                for(let key in styles){
                    this.styles[key]=styles[key]
                }
            }
        }catch(e){}
    },
   
  
    methods:{
        saveCommonData(data){
            try{
                let forms=this.$refs.tableEdits;
                for(let i=0;i<forms.length;i++){
                    try{
                        forms[i].saveData(data)
                    }catch(e){console.log(e.message)}
                }
            }catch(e){console.log(e.message)}
            
            
           
        },
        initSaveData(){
            try{
                let forms=this.$refs.tableEdits;
                for(let i=0;i<forms.length;i++){
                    try{
                        forms[i].initSaveData()
                    }catch(e){console.log(e.message)}
                }
            }catch(e){console.log(e.message)}
             
             
        },
        initData(){
           let that=this;
            that.$nextTick(() => {
                try{
                    let forms=that.$refs.myForms;
                    for(let i=0;i<forms.length;i++){
                        try{
                            forms[i].initData();
                        }catch(e){}
                    }
                }catch(e){console.log(e.message)}
                try{
                    let formss=that.$refs.tableEdits;
                    for(let i=0;i<formss.length;i++){
                        try{
                            formss[i].initData();
                        
                        }catch(e){}
                    }
                }catch(e){console.log(e.message)}
                
                
            });
            
        },
        getValidateMsg(){
            let message="";
            try{
                let forms=this.$refs.myForms;
                for(let i=0;i<forms.length;i++){
                    try{
                    
                    ///for(let i=0;i<forms.length;i++){
                        let message_=forms[i].validate();
                        if(message_){
                            message=message_;
                            
                        }
                    
                // }
                    }catch(e){}
                }
            }catch(e){}
            try{
                let formss=this.$refs.tableEdits;
                for(let i=0;i<formss.length;i++){
                    try{
                    
                        let message_=formss[i].validate();
                        if(message_){
                            message=message_;
                            
                        }
                    }catch(e){}
                }
            }catch(e){}
            
            
            return message;
        },
        goSearchList(){
            try{
                let forms=this.$refs.myForms;
                for(let i=0;i<forms.length;i++){
                    try{
                        forms[i].goSearchList();
                    }catch(e){}
                }
            }catch(e){}
            
           
             try{
                 let el=this.$refs.tableEdits;
                 if(el.length){
                      for(let i=0;i<el.length;i++){
                        el[i].goSearchList();
                    }
                 }else{
                        
                    this.$refs.tableEdits.goSearchList();
                 }
                
            }catch(e){}
            
        },
        goSeach2(data){
            this.$emit("goSeach2",data);
        },
        goSeach(data){
           
            this.$emit("goSearch",data);
        },
        openWinEdit(data){
            this.$emit("openWinEdit",data);
        },
        remove(data){
            this.$emit("remove",data);
        },
        changeInput(data){
            this.$emit("changeInput",data);
        },
        rowDbClick(data){
            this.$emit("rowDbClick",data);
        },
        funeralItemSelectEvent(data){
            this.$emit("funeralItemSelectEvent",data);
            /*if(this.$refs.tableEdits)
                this.$refs.tableEdits[this.$refs.tableEdits.length-1].addItem(data);*/
            
    
        },
        addItem(data){
            if(this.$refs.tableEdits){
                try{
                    this.$refs.tableEdits[0].addItem(data);
                }catch(e){}
                try{
                    this.$refs.tableEdits.addItem(data);
                }catch(e){}
            }
                
        },
        addItem2(data){
            try{
            if(this.type=='funeral_item_table'||this.type=='funeral_item_table_cemetery'||this.type=='funeral_item_table_type'||this.type=='gm_funeral_item_table'){
                
                if(this.$refs.tableEdits)
                    this.$refs.tableEdits[0].addItem(data);
            }
            }catch(e){}
            
        }
    }
}
</script>
<style scoped>
    .formmain{
        display: flex;
        flex-direction: row;
        margin-top:5px;
        
    }
    .formmainr{
        display: flex;
        flex-direction: row;
        margin-top:5px;
        flex-wrap: wrap;
    }
    .card-main{
        padding:5px;
        height:100%;
    }
    .card{
        box-sizing:border-box;
        background:#fff;
        padding:20px;
        height:100%;
    }
    .formmainposition{
        display: inline-block;
        margin-top:5px;
        position:absolute;
        top:0;
        margin-left:5px;
    }
    .noflex{
        display:inline-block;
        margin-top:5px;
    }
    .formmainnoflex{
        display:inline-block;
        margin-top:5px;
    }
    .formmainh{
        display: flex;
        flex-direction: column;
        margin-top:5px;
    }
    .formmain>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .formmainnoflex>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .noflex>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .formmainposition>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .formmainh>>>.el-card__header{
        color: rgb(102, 177, 255);
        text-align:left;
    }
    .form_card2 >>>.el-card__body{
        padding-bottom:30px !important;
    }
    .form_card3 >>>.el-card__body{
        padding-bottom:0px !important;
    }
</style>